import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/pages/home'
import Index from '@/pages/index'

Vue.use(VueRouter)

const routes = [
  {
    // home的孩子公用home的结构 通过router-view切换中间内容
    path: '/',
    name: 'home',
    component: Home,
    redirect: '/index',
    children: [
      {
        path: 'index',
        name: 'index',
        component: Index
      },
      {
        // 动态定义路由
        path: 'product/:id',
        name: 'product',
        component: () => import('@/pages/product.vue')
      },
      {
        path: 'detail/:id',
        name: 'detail',
        // component: Detail
        component: () => import('@/pages/detail.vue')

      },
    ]
  },
  {
    path: '/cart',
    name: 'cart',
    // component: Cart
    component: () => import('@/pages/cart.vue')
  },
  {
    path: '/login',
    name: 'login',
    // component: Login
    component: () => import('@/pages/login.vue')//resolve => require(['@/pages/login'],resolve)
  },
  {
    path: '/order',
    name: 'order',
    component: () => import('@/pages/order.vue'),
    children: [
      {
        path: 'confirm',
        name: 'order-confirm',
        component: () => import('@/pages/orderConfirm.vue')
      },
      {
        path: 'list',
        name: 'order-list',
        component: () => import('@/pages/orderList.vue')
      },
      {
        path: 'pay',
        name: 'order-pay',
        component: () => import('@/pages/orderPay.vue')
      },
      {
        path: 'alipay',
        name: 'ali-pay',
        component: () => import('@/pages/alipay.vue')
      }
    ]
  }
]

const router = new VueRouter({
  routes
})

export default router
